<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
  <head>
    <title>工作空间</title>
    <jsp:include page="/WEB-INF/jsp/common/basic.jsp"></jsp:include>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/style/css/skins/_all-skins.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/plugin/table/bootstrap-table.css">
  </head>

  <body class="sidebar-mini skin-red-light" style="height: auto; min-height: 100%;">
  <div class="wrapper" style="height: auto; min-height: 100%;">
  
  <!-- 头部 -->
  <jsp:include page="/WEB-INF/jsp/common/top.jsp"></jsp:include>
  
  
  <!-- 左边 -->
  <%@ include file="/WEB-INF/jsp/common/left.jsp" %>
 
 
   <!-- 内容区域 -->
  <div class="content-wrapper" style="min-height: 1126px;">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <h1>
      	  帖子列表
        <small>帖子列表</small>
      </h1>
      <ol class="breadcrumb">
        <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
        <li><a href="#">Examples</a></li>
        <li class="active">Blank page</li>
      </ol>
    </section>

    <!-- Main content -->
    <section class="content">
    	<!-- 添加搜索条件 -->
              <div class="box-body">
                <div class="row">
                  <form id="searchForm" action="" onsubmit="return false;">
                    <div class="col-xs-2">
                       <select class="form-control" name="key" id="query_key">
                         <option value="title">标题</option>
                         
                       </select>
                    </div>
                    <div class="col-xs-2">
                      <input type="text" id="query_value" name="value" class="form-control" placeholder="关键字">
                    </div>
                    <div class="col-xs-2">
                       <button type="submit" class="btn bg-olive btn-flat">查询</button>
                    </div>
                  </form>
                </div>
              </div>
      <!-- 操作按钮 -->
      <div id="toolbar">

        <button type="button" data-ope="edit" class="btn bg-orange btn-flat">编辑</button>
        
      </div>
      
      <table id="user_table"></table>
    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->

  
   <!-- 底部 -->
   <jsp:include page="/WEB-INF/jsp/common/bottom.jsp"></jsp:include>
   
   <!-- 设置 -->
   <jsp:include page="/WEB-INF/jsp/common/setting.jsp"></jsp:include>
  </div>


    <!-- SlimScroll -->
    <script src="${pageContext.request.contextPath}/static/plugin/jquery-slimscroll/jquery.slimscroll.min.js"></script>
    <!-- FastClick -->
    <script src="${pageContext.request.contextPath}/static/plugin/fastclick/fastclick.js"></script>
    
    <!-- 引用表格插件 -->
    <script src="${pageContext.request.contextPath}/static/plugin/table/bootstrap-table.js"></script>
    <script src="${pageContext.request.contextPath}/static/plugin/table/bootstrap-table-zh-CN.js"></script>
    
    <script>
      $(function(){
        $('.sidebar-menu').tree();
          var queryUrl = '${pageContext.request.contextPath}/admin/topics/list';
    	  $table = $('#user_table').bootstrapTable({
    	    url: queryUrl,                      //请求后台的URL（*）
            method: 'GET',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: true,                     //是否启用排序
            sortOrder: "asc",                   //排序方式

            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）

            pageNumber: 1,                      //初始化加载第一页，默认第一页,并记录
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10, 20, 30, 100],        //可供选择的每页的行数（*）

            clickToSelect: true,                //是否启用点击选中行
            uniqueId: "id",                     //每一行的唯一标识，一般为主键列
            
            //得到查询的参数
            queryParams : function (params) {
            	//修改原来提交的参数名
                 var temp = {
                     pageNum: (params.offset / params.limit) + 1, 
                     sort: params.sort,   
                     sortOrder: params.order, //排位命令（desc，asc）
                     limit:params.limit
                 };
               return temp;
            },
            
            columns: [{
            	
                checkbox: true,
                visible: true                  //是否显示复选框
            },{
                field: 'title',
                title: '帖子标题'
            },{
                field: 'content',
                title: '内容'
            },{
                field: 'commentcount',
                title: '评论数'
            },{
                field: 'status',
                title: '帖子状态'
            },{
                field: 'topictime',
                title: '发布时间'
            },{
                field: 'nicetopic',
                title: '精品帖子'
            },{
                field: 'user.id',
                title: '发帖人'
            },{
                field: 'label.id',
                title: '帖子标签'
            },{
                field: 'categorys.id',
                title: '版块id' 
                
            }],
            responseHandler: function(res) {
                return {
                    "total": res.total,//总页数
                    "rows": res.rows   //数据
                 };
            }
        });
    	  
        //监听删除\编辑按钮
    	  $("#toolbar > button").click(function(){
    		//获取总的记录数  
      		var idArray = $table.bootstrapTable('getAllSelections');
      		if(idArray.length !=1){
      			alert("有且必须选中一条记录");
      			return;
      		}
      		var ope = $(this).data("ope");
      		if("delete"==ope){
      			//删除
      			//获取主键
      			var id = idArray[0].id;
      			
      			$.ajax({
      				type:"get",
      				url : "${pageContext.request.contextPath}/topics/delete/"+id,
      				success:function(msg){
      					//table
      					$table.bootstrapTable('refresh');
      				}
      			})
      			
      			
      		}else if("edit"==ope){
      			//界面跳转
      			window.location.href="${pageContext.request.contextPath}/admin/topics/edit/"+idArray[0].id+"";
			 
      		}else if("print"==ope){
      			//发送ajax请求更新状态
      			$.ajax({
      				type:"get",
      				url : "${pageContext.request.contextPath}/topics/sends/"+idArray[0].id,
      				success:function(msg){
      					$table.bootstrapTable('refresh');
      					if(!msg.success){
      						alert(msg.msg);
      					}
      				}
      			})
      		}
      	});
        $("#searchForm").on("submit",function(){
        	var param = $(this).serializeObject();  
        	if(param.key && param.value){
    			var key = param.key;
    			var value = param.value;
    		    delete param['key'];
    		    delete param['value'];
    			param[key] = value;
    		}
    		$table.bootstrapTable('refresh',{query:param});
        	return false;
        });

    });
        
    </script>
  </body>
</html>
